<template>
  <div class="user-container app-container page-industry-list">
    <div class="filter-container">
      <div>
        <el-button v-waves class="filter-item" type="primary" icon="el-icon-circle-plus" @click="onEditOrAdd()">
          新增行业
        </el-button>
      </div>
      <div>
        <el-input v-model="listQuery.mid_table_remark_001_like" placeholder="请输入行业名称" clearable
          class="filter-item input-item" style="width: 200px" @clear="handleFilter" @keyup.enter.native="handleFilter" />
        <el-button v-waves class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">
          搜索
        </el-button>
      </div>
    </div>
    <div class="page-content">
      <el-table :key="0" v-loading="listLoading" :data="list" border fit highlight-current-row style="width: 100%">
        <!-- <el-table-column label="序号" align="center" width="80">
                    <template slot-scope="scope">
                        <span>{{ scope.$index + 1 }}</span>
                    </template>
                </el-table-column> -->
        <el-table-column label="ID" align="center" width="80">
          <template slot-scope="{ row }">
            <span>{{ row.id_public_middle_table }}</span>
          </template>
        </el-table-column>
        <el-table-column label="行业名称" align="center">
          <template slot-scope="{ row }">
            {{ row.mid_table_remark_001 }}
          </template>
        </el-table-column>
        <el-table-column label="规则数量" align="center" width="80" :resizable="false">
          <template slot-scope="{ row }">
            {{ row.save_data_001 }}
          </template>
        </el-table-column>
        <el-table-column label="更新时间" align="center" width="160" :resizable="false">
          <template slot-scope="{ row }">
            {{ row.time_update }}
          </template>
        </el-table-column>
        <el-table-column label="规则配置" align="center" width="220" :resizable="false">
          <template slot-scope="{ row }">
            <el-button type="text" size="mini" @click="toRule(row)">
              Basic
            </el-button>
            <el-button type="text" size="mini" @click="onEditOrAdd(row)">
              Embedding
            </el-button>
            <el-button type="text" size="mini" @click="onEditOrAdd(row)">
              Fine-tuning
            </el-button>
          </template>
        </el-table-column>

        <el-table-column label="操作" align="center" width="220" class-name="small-padding fixed-width" :resizable="false">
          <template slot-scope="{ row }">
            <span ype="text" size="mini" @click="onEditOrAdd(row)" class="table-btn">
              编辑
            </span>
            <span ype="text" size="mini" @click="toSearchLog(row)" class="table-btn">
              搜索记录
            </span>
            <span ype="text" size="mini" @click="toChat(row)" class="table-btn">
              立即搜索
            </span>
            <span type="text" size="mini" class="col-danger table-btn" @click="handleDelete(row)">
              删除
            </span>
          </template>
        </el-table-column>
      </el-table>
    </div>

    <pagination v-show="total > 0" :total="total" :page.sync="currentPage" :limit.sync="listQuery.limit"
      @pagination="getPageList" />
    <!-- <question-detail ref="refQuestionDetail" @refresh="onRefresh"></question-detail> -->
    <comp-new-modify ref="refNewModify" @refresh="onRefresh"></comp-new-modify>
  </div>
</template>

<script>
import waves from "@/directive/waves"; // waves directive
import Pagination from "@/components/Pagination";
import { middleList } from "@/api/middle";
import CompNewModify from "./components/new_modify.vue";
export default {
  name: "Industry",
  directives: { waves },
  components: {
    Pagination,
    CompNewModify,
  },
  data() {
    return {
      listQuery: {
        mid_table_remark_001_like: null,
        invoke_method: "public_load_middle_table_list",
        pre_db_para_middle_table_name:
          "public_middle_table_lite_mod_ai_chatgpt",
        type_middle_app: 12001,
        type_inner_app: 1001,
        is_online: 0,
        pre_db_para_begin_idx: 0,
        pre_db_para_length_4_list: 10,
        pre_cmd_para_show_trade_info: true,
        pre_db_para_order_by_para: "id_public_middle_table desc",
      },
      listLoading: false,
      list: [],
      total: 1,
      currentPage: 1,
    };
  },
  mounted() {
    this.getList();
    // this.getShopData();
  },
  methods: {
    /*
     * 获取页面数据
     * */
    getList() {
      this.listLoading = true;
      middleList(this.Qs.stringify(this.listQuery)).then((response) => {
        this.list = response.page_content;
        this.total = response.result_num;
        // Just to simulate the time of the request
        setTimeout(() => {
          this.listLoading = false;
        }, 0.5 * 1000);
      });
    },
    /*
     * 查询数据
     * */
    handleFilter() {
      this.listQuery.pre_db_para_begin_idx = 0;
      this.getList();
    },
    /*
     * 点击分页进行查询
     * */
    getPageList(val) {
      this.listQuery.pre_db_para_begin_idx =
        (val.page - 1) * this.listQuery.pre_db_para_length_4_list;
      this.getList();
    },
    // 新增/编辑数据
    onEditOrAdd(row) {
      this.$refs.refNewModify.onEditOrAdd(row);
    },
    toRule(row) {
      this.$router.push({
        path: "/industryRule",
        query: {
          id: row?.id_public_middle_table || "",
          name: row?.mid_table_remark_001 || "",
        },
      });
    },
    toSearchLog(row) {
      this.$router.push({
        path: "/industrySearchLog",
        query: {
          id: row?.id_public_middle_table || "",
          name: row?.mid_table_remark_001 || "",
        },
      });
    },
    toChat(row) {
      this.$router.push({
        path: "/industryChat",
        query: {
          id: row?.id_public_middle_table || "",
          name: row?.mid_table_remark_001 || "",
        },
      });
    },
    toSearch(row) {
      this.$router.push({
        path: "/industrySearchLog",
        query: {
          id: row?.id_public_middle_table || "",
          name: row?.mid_table_remark_001 || "",
        },
      });
    },

    // 刷新页面数据
    onRefresh() {
      this.getList();
    },

    handleDelete(item) {
      this.$confirm("您确定要删除该行业吗?", "提示", {
        type: "warning",
      })
        .then(() => {
          middleList(
            this.Qs.stringify({
              invoke_method: "public_insert_or_update_middle_table",
              pre_db_para_middle_table_name:
                "public_middle_table_lite_mod_ai_chatgpt",
              type_middle_app: 12001,
              type_inner_app: 1001,
              is_online: 111,
              pre_db_para_id_public_middle_table: item.id_public_middle_table,
            })
          )
            .then((response) => {
              this.$notify({
                title: "Success",
                message: "删除成功",
                type: "success",
                duration: 2000,
              });
              if (
                this.total - 1 ==
                (this.currentPage - 1) *
                this.listQuery.pre_db_para_length_4_list
              ) {
                if (this.currentPage - 2 > 0 || this.currentPage - 2 == 0) {
                  this.listQuery.pre_db_para_begin_idx =
                    (this.currentPage - 2) *
                    this.listQuery.pre_db_para_length_4_list;
                }
              }
              this.getList();
            })
            .catch(() => { });
        })
        .catch(() => { });
    },
  },
};
</script>

<style lang="scss" scoped>
@import "../../styles/common.scss";
.page-industry-list {
  .filter-container {
    display: flex;
    display: -webkit-flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }


}
</style>
